import Vue from 'vue'
import Vuex from 'vuex'
import { LoginApi } from '@/api'
Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    refresh_token: localStorage.getItem('refresh_token') || '',
    // eslint-disable-next-line no-undef
    token: localStorage.getItem('token') || ''
  },
  mutations: {
    // 修改 state 中的 token 值
    setToken (state, token) {
      state.token = token
      localStorage.setItem('token', token)
    },
    // 修改 state 中的 refresh_token 值
    setRefreshToken (state, refresh_token) {
      state.refresh_token = refresh_token
      localStorage.setItem('refresh_token', refresh_token)
    }
  },
  actions: {
    // 为什么使用vuex 实现登陆功能
    // 正常的企业开发场景会将登录，获取用户信息等功能放在vuex的action中进行调用
    // token多处多次使用，是一个公共的状态，vuex更适合公共状态管理

    // vuex 实现登录并保存token的步骤
    // 1.在vuex中的state里定义变量
    // 2.在mutations 中定义修改state数据的方法
    // 3.需要在vuex 中引入接口（登录接口）
    // 4. 在actions 中实现接口的调用， 同时调用vuex 中的mutations中的方法 实现将
    // 接口的返回值存放在 vuex 的 state 中

    async asyncLoginAction (store, val) {
      try {
        const res = await LoginApi(val)
        const { refresh_token, token } = res.data.data
        store.commit('setToken', token)
        store.commit('setRefreshToken', refresh_token)
        return Promise.resolve(res)
      } catch (err) {
        return Promise.reject(err)
      }
    }
  },
  modules: {
  }
})
